'use strict';

import React from 'react';
import ReactDOM from 'react-dom';
import { Router, Route ,Link , Redirect} from 'react-router';
import {Navbar,Nav,NavItem,NavDropdown,MenuItem} from 'react-bootstrap';

import 'bootstrap/dist/css/bootstrap.css'
import './main.css';
import 'bootstrapjs';

import MenuCompenet from './layout/menu';
import TypeList from './manager/tmanager';
import Exam from './exam/exam';
import QuestionList from './manager/questions';
//require('icheck/icheck.min.js');
//require('jplayer');
//require('flat-ui/css/flat-ui.css');

//require('icheck/')
//var ReactDom = require('react-dom');

class Manager extends React.Component{
	render(){
		return(
			<div className = "row">
				<div className="col-md-2 col-xs-2">
					<MenuCompenet />
				</div>
				<div className="col-md-10 col-xs-10">
					{this.props.children}
				</div>
			</div>
		);
	}
}
class App extends React.Component {
	render(){
		return (
		<div>
			<Navbar>
				<Navbar.Header>
					<Navbar.Brand>
						<span>考试管理系统</span>
					</Navbar.Brand>
				</Navbar.Header>
				<Nav>
					<NavItem eventKey={1} href="#/manager">
						试卷管理
					</NavItem>
					<NavItem eventKey={2} href="#/exam">
						考试管理
					</NavItem>
					<NavDropdown eventKey={3} title="系统管理" id="sys_manger">
						<MenuItem eventKey={3.1}>用户管理</MenuItem>
						<MenuItem divider />
						<MenuItem eventKey={3.2}>角色管理</MenuItem>
					</NavDropdown>
				</Nav>
			</Navbar>
			
			
			{this.props.children}
	    </div>
		);
	}
}

const routes = (
	<Router>
		<Route path="/" component={App}>
			<Route path="exam" component={Exam}/>
			<Route path="manager" component={Manager}>
				<Route path="types" component={TypeList}/>
				<Route path="questions" component={QuestionList}/>
			</Route>
		</Route>
		
	</Router>
);

ReactDOM.render(routes,document.getElementById('test'));